<template>
	<page>
		<view class='user-avatar-container'>
			<view class='user-avatar-wrap dp-flex-between'>
				<view class='avatar-wrap dp-flex-y-center' @tap='updataUserAvatar'>
					<image class='user-avatar' src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/work/allAvatar.jpg'></image>
				</view>
				<view class='avatar-right-wrap'>
					<view class='user-name-wrap dp-flex-y-center'>
						<text class='user-name'>{{userInfo.name||userInfo.nickName}}</text>
						<view class='user-level-img' v-if="userInfo.type != 1">
							<block v-for="(i,item) in vipLevel">
								<image class="icon-star vip-star" v-if="i" src="/static/images/user-center/4level-light.png"></image>
								<image class="icon-star vip-star" v-else src="/static/images/user-center/4level-dark.png"></image>
							</block>
						</view>
					</view>
					<view class='user-type-wrap'>
						<block v-if="userInfo.type == 1">
							<!-- 暂时只允许微信授权的用户并且没有入驻的用户入驻 -->
							<view class='dp-flex' v-if="login_type==1&&userInfo.type == 1">
								<view class='user-avatar-btn' @tap='showUserModal' :data-mobile="userInfo.mobile">免费入驻</view>
							</view>
							
						</block>
						<block v-else-if="userInfo.viplever_id != 0">
							<view class='dp-flex-y-center'>
								<text class='user-type'>有效期至</text>{{expiryTime}}
								 <navigator url='my-info/my-info' class='user-type ml-10' :class="isVipEnd ?'renewal-fee':''" hover-class='none'>
									<text style='color:#FCBE46;'>编辑资料</text>
								  </navigator>
							</view>
						</block>
						<block v-else>
							<view class='dp-flex-y-center' style='display: inline-block;margin-right: 10upx;'>
								<text class='user-type'>立即开通会员接单赚钱</text>
							</view>
							<block v-if="userInfo.viplever_id == 0 && userInfo.type != 1">
								<navigator url='vip-card/vip-card' class='user-header-btn' hover-class='none'>开通会员</navigator>
							</block>
						</block>
					</view>
					<view class='user-level' v-if="userInfo.type != 1">
						<text class='user-level-text'>人气指数</text>
						<view class='user-level-img'>
							<block v-for="(i,item) in starLevel">
								<image class="icon-star" v-if="i" src="/static/images/user-center/star-light.png"></image>
								<image class="icon-star" v-else src="/static/images/user-center/star-dark.png"></image>
							</block>
						</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 邀请中的人 -->
		<view class='exhibition'>
			<navigator url="my-invite-list/my-invite-list?type=1" class="exhibition-list" hover-class="none">
				<text class='font16'>我的施工队</text>
				<text class='color_red font32'>{{status.has_come}}</text>
			</navigator>
			
			
			
			
			
			<navigator url="user_spread_red/index" class="exhibition-list" hover-class="none">
				<text class='font16'>余额</text>
				<text class='color_red font32'>{{userInfo.money}}</text>
			</navigator>
			<navigator url="user_spread_stay/index" class="exhibition-list" hover-class="none">
				<text class='font16'>待结算</text>
				<text class='color_red font32'>{{userInfo.money_no}}</text>
			</navigator>
			
			
			
			
			<!-- <navigator url="my-invite-list/my-invite-list?type=0" class="exhibition-list" hover-class="none">
				<text class='font16'>邀请中</text>
				<text class='color_red font32'>{{status.not_come}}</text>
			</navigator>
			<navigator url="my-invite-list/my-invite-list?type=2" class="exhibition-list" hover-class="none">
				<text class='font16'>人气指数</text>
				<text class='color_red font32'>{{userInfo.score_level}}</text>
			</navigator> -->
			
			
			
			<!-- pages/user-center/my-account/money-detail/money-detail -->
			<navigator url="my-account/money-detail/money-detail" class="exhibition-list" hover-class="none">
				<text class='font16'>我的积分</text>
				<text class='color_red font32'>{{participationMoney}}</text>
			</navigator>
		</view>
		
		<view class='extension'>
		   <text class='listActive'>业务信息共享：我的施工队满100免费开通会员1年，满300永久免费。</text>
		</view>
		<!-- 中间的菜单功能 -->
		<view class='us'>
			<block v-for="(item,index) in usList">
				<view class='us-list' hover-class="none" v-if="index == 0" @tap='goMerchant'>
					<image class='us-list-img' :src="item.src"></image>
					<text class='us-list-text'>{{item.name}}</text>
				</view>
				<navigator :url="item.url" class='us-list' hover-class="none" v-if="index != 3 && index != 0">
					<image class='us-list-img' :src="item.src"></image>
					<text class='us-list-text'>{{item.name}}</text>
				</navigator>
				<view class='us-list' hover-class="none" v-if="index == 3" @tap='goBusiness'>
					<image class='us-list-img' :src="item.src"></image>
					<text class='us-list-text'>{{item.name}}</text>
				</view>
			</block>
		</view>

		<!-- 推广banner -->
		<button open-type='share' class="" type="warn" style='padding: 0px;border:0;border-radius: 0;' plain="true" @tap='bomWxShare'>
			<view class='banner-img'>
				<image src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/picture/wodeyaoqin.jpg'></image>
			</view>
		</button>
		<!-- 资讯部分 -->
		<view class='weui-cells' style='margin-top:0;'>
			
			  <!-- 邀请好友获取积分详细介绍 -->
			    <navigator url="/pages/order-list/order-list" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
			    <view class="weui-cell__hd dp-flex-y-center">
			      <image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_5.png"></image>
			    </view>
			    <view class="weui-cell__bd">我的装修预算</view>
			    <view class="weui-cell__ft weui-cell__ft_in-access"></view>
			  </navigator>
			  
			  
			  
			    <navigator url="/pages/order-list-edit/order-list-edit" class="weui-cell weui-cell_access" hover-class="weui-cell_active" v-if="userInfo['order_gai']">
			      <view class="weui-cell__hd dp-flex-y-center">
			        <image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_1.png"></image>
			      </view>
			      <view class="weui-cell__bd">修改装修预算</view>
			      <view class="weui-cell__ft weui-cell__ft_in-access"></view>
			    </navigator>
				
			  
			  
			<navigator url="news-detail/news-detail?id=1" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_5.png"></image>
				</view>
				<view class="weui-cell__bd">邀请好友获取积分详细介绍</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- 招募合伙人 -->
			<navigator url="news-detail/news-detail?id=21" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_1.png"></image>
				</view>
				<view class="weui-cell__bd">招募合伙人</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- 使用指南 -->
			<navigator url="news-list/news-list?id=1" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_3.png"></image>
				</view>
				<view class="weui-cell__bd">使用指南</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- 联系我们 -->
			<navigator url="contact-us/contact-us" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_4.png"></image>
				</view>
				<view class="weui-cell__bd">联系我们</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- 我的名片 -->
			<navigator url="news-detail/news-detail?id=22" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_6.png"></image>
				</view>
				<view class="weui-cell__bd">我的名片</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- 发送短信 -->
			<!-- #ifdef APP-PLUS -->
			<navigator url="../mail-list/mail-list" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_6.png"></image>
				</view>
				<view class="weui-cell__bd">我的联系人</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
			<!-- #endif -->
			<!-- #ifdef APP-PLUS -->
			<!-- <navigator url="../test/push-one" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_6.png"></image>
				</view>
				<view class="weui-cell__bd">消息推送</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator> -->
			<!-- #endif -->
			
			<!-- <navigator url="../test/room" class="weui-cell weui-cell_access" hover-class="weui-cell_active">
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_6.png"></image>
				</view>
				<view class="weui-cell__bd">是否关联群聊</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator> -->
			
			<!-- 招募合伙人 -->
			<navigator class="weui-cell weui-cell_access" hover-class="weui-cell_active" @tap='goLogout'>
				<view class="weui-cell__hd dp-flex-y-center">
					<image class="icon-cell" src="http://aliyun.oss.zxgyzj.com/picture/tab_my/my_list_1.png"></image>
				</view>
				<view class="weui-cell__bd">切换账号</view>
				<view class="weui-cell__ft weui-cell__ft_in-access"></view>
			</navigator>
	
		</view>

		<!-- 显示自己名片的部分 -->
		<view class='card'>
			<image class='card-img' src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/picture/tab_my/card-back.jpg'></image>
			<image class='address-card-wx' :data-id="userInfo.id" :data-name="userInfo.name" @tap='bindEwm' src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/picture/tab_my/card-wx.png'></image>
			<view class='card-block'>
				<view class='card-block-head' @tap='openCard' :data-id="userInfo.id">
					<view class='card-block-head-top'>
						<image v-if="userInfo.newAvatarUrl" class='block-head-img' :src="userInfo.newAvatarUrl"></image>
						<image v-else class='block-head-img' :src="userInfo.avatarUrl ? userInfo.avatarUrl : defaultAvatar"></image>
						<view class='block-head-user'>
							<view class='block-head-user-name'>
								<view class='block-head-user-name-title'>{{userInfo.name||userInfo.nickName}}</view>
								<view class='user-level-img'>
									<text class='user-level-text-mobile'>{{userInfo.mobile}}</text>
								</view>
							</view>
							<view class='block-head-user-workCategory'>
								<text v-if="userInfo.workCategory.name">{{userInfo.workCategory.name}}</text>
								<text v-if="userInfo.secondary.name">{{userInfo.secondary.name}}</text>
							</view>
						</view>
					</view>
					<view class='card-block-head-address'>
						<image class='address-card-host' mode='scaleToFill' src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/small_img/weizhi.png'></image>
						<text class='address-card-name'>{{userInfo.address}}</text>
					</view>
				</view>

				<!-- 名片下的分享 -->
				<view class='card-line-btn'>
					<view class='line-btn-editinfo' @tap='editCard' :data-id="userInfo.id">
						<image src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/small_img/huiyuan.png'></image>
						完善名片
					</view>

					<view class='line-btn-collect' @tap='openInvitation' :data-id="userInfo.id">
						<image src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/small_img/renqi.png'></image>
						<text>人气{{status.has_come||0}}</text>
					</view>

					<!-- 分享进入自己详情页 ../user-center/my-info/cardcase/cardcase?id={{item.id}} -->
					<button class='line-btn-card' @tap='openCard' :data-id="userInfo.id">
						<image src='https://gy-files.oss-cn-shenzhen.aliyuncs.com/small_img/fenxian.png'></image>
						查看名片
					</button>
				</view>
				<!-- 名片的结束页 -->
			</view>
		</view>

		<!-- 技术支持 -->
		<view class='jishuzhichi-box'>
			<text @tap='bindJIshuzhichiPhone'>技术支持：同区网络科技</text>
		</view>
	</page>
</template>

<script>
	import app from '@/App.vue';
	import {
		GYZJMODEL as gyzjModel
	} from '@/utils/gyzjModel.js'
	export default {
		onLoad() {
			var arr=app.globalData;
			/*微信授權才允許入駐*/
			let loginType=this.main_getGlobal();
			if(loginType.type==1){
				this.login_type=1;
			}
			console.log('进来的arr的值',arr);
			/*手机号码登录处理异布代码*/
			let userInfo = app.globalData.userInfo;
				let that = this;
				let expiryTime = gyzjModel.prototype.formatTime(userInfo.expiry_time, 2);
				console.log('有效期expiry_time的值', expiryTime);
				if (userInfo.expiry_time) {
					that.isVipEndFunc(userInfo.expiry_time);
				}
				let starLevel = gyzjModel.prototype.convertToStarsArray(userInfo.score_level, 5);
				let vipLevel = gyzjModel.prototype.convertToStarsArray(userInfo.viplever_id, 3);
				/*设置值*/
				/*微信小程序这里需要放到后面设置值,不然会属性不存在*/
				this.userInfo = userInfo;
				this.expiryTime = expiryTime;
				this.starLevel = starLevel;
				this.vipLevel = vipLevel;
				this.getDividend();
				this.getMySubordinate(0);
			// }
			
		},
		/*生命周期函数--监听页面显示*/
		onShow() {
			
		},
		methods: {
			//退出登录
			goLogout:function(){
				uni.showModal({
					title: '退出',
					content: '您确定要退出该账号吗?',
					confirmText: "确定",
					confirmColor: '#f94c48',
					cancelText: "取消",
					cancelColor: '#f94c48',
					success(res) {
						console.log('res的值',res);
						 if(res.cancel){
							// 用户点击了取消属性的按钮，对应选择了'女'
							console.log('取消退出');
						  }else if(res.confirm){
							//执行退出登录
							uni.navigateTo({
								url:'/pages/login/login-select/login-select'
							});
						  }
		
					}
				});
			},
			//分享到微信
			bomWxShare:function(){
				console.log('测试');
				// #ifdef APP-PLUS
				// let arr=this.main_getGlobal();
				// this.main_is_login(arr);
				// if(arr.token=='0739'){
				// 	return false;
				// }
				console.log('this.userInfo',this.userInfo);
				let wx_id=this.main_config_wx_id;
				console.log('wx_id的值',wx_id);
				let imageUrl='http://aliyun.oss.zxgyzj.com/theme/ZX-GY-ZJT20190716ec6ce8704154dbed5f9c49a21ed5de28.jpg';
				let title='点击：您将进入装修行业【业务信息共享平台】……';
				let path='';
		
				if(app.globalData.userInfo.openid){
					 path='pages/index/index?inviteCode='+app.globalData.userInfo.openid;
					
				}else{
					path='pages/index/index';
					 
				}
		
				gyzjModel.prototype.shareLink(title,imageUrl,wx_id,path);
				// #endif
			},
			/*弹出入驻框*/
			showUserModal:function(e){
				let mobile=e.currentTarget.dataset.mobile;
				console.log('手机号的值',mobile);
				/*填写手机号码的第二种方式*/
				if(mobile){
					gyzjModel.prototype.showUserModal('../vip-info/vip-info');
				}else{
					gyzjModel.prototype.showUserModal('../ads/fill-phone/fill-phone');
				}
			},
			// 技术支持
			  bindJIshuzhichiPhone: function() {
			    uni.makePhoneCall({
			      phoneNumber: this.main_config_phone
			    })
			  },
			 //跳转自己的邀请成功
			  openInvitation: function () {
			    wx.navigateTo({
			      url: './my-invite-list/my-invite-list?type=1',
			    });
			  },
			
			/*邀请的人*/
			getMySubordinate: function(cat, loadMore) {
				let that=this;
				console.log('进来加载');
				uni.showLoading({
					title: '加载中...',
				})
				var arr=that.main_getGlobal();
				console.log('进来的arr的值',arr);
				gyzjModel.prototype.getMySubordinate(cat, arr.token, arr.type).then(res => {
					console.log('type进来', arr.type);
					this.status = res.data.countArr;
					// this.group_money = res.data.userArr;
					uni.hideLoading();
				})
			},
			// 计算是否过期
			isVipEndFunc: function(time) {
				console.log('过期开始', time);
				const now = Math.round(new Date().getTime() / 1000);
				console.log('now', now);
				if (time - now < 0) {
					this.isVipEnd = true;
					this.vipEndModal();
				}
			},
			// 会员过期弹窗
			vipEndModal: function() {
				if (this.isVipEnd) {
					uni.showModal({
						content: '您的会员年费已经到期，请您及时续费',
						confirmColor: '#F94C48',
						success: (res) => {
							if (res.confirm) {
								//  uni.navigateTo({
								// url: '/pages/user-center/vip-card/vip-card',
								//  })
							}
						}
					})
				}
			},
			//分享打开自己的名片
			openCard: function() {
				uni.navigateTo({
				  url: './my-info/cardcase/cardcase?id=' + this.userInfo.id,
				});

			},
			//完善自己的名片
			editCard: function() {
				// let arr=this.main_getGlobal();
				// this.main_is_login(arr,'./my-info/my-info');
				uni.navigateTo({
					url: './my-info/my-info',
				});
			},
			/*查看自己的名片进来*/
			goBusiness: function() {
				// var arr=this.main_getGlobal();
				// this.main_is_login(arr,'./my-info/my-info');
				uni.navigateTo({
					url: './my-info/my-info',
				});
			},
			/*进入店铺*/
			goMerchant: function() {
				var arr=this.main_getGlobal();
				let userInfo=this.userInfo;
				this.main_is_merchant(arr,'../merchant/no-merchant/no-merchant',userInfo);
				console.log('我的店铺');
				/*如果还没有入驻*/
				// if (this.userInfo.type == 1) {
				// 	this.isShowUserModal = true;
				// } else {
				// 	if (this.userInfo.is_merchant == 1) {
				// 		uni.navigateTo({
				// 			url: '../merchant/no-merchant/no-merchant',
				// 		})
				// 	} else {
				// 		uni.navigateTo({
				// 			url: '../merchant/my-merchant/my-merchant',
				// 		})
				// 	}
				// }
			},

			// 获取分红收入
			getDividend: function() {
				/*这里直接调用余额数据 */
				console.log('进来yes');
				let userInfo = app.globalData.userInfo;
				let that = this;
				var totalMoney;
				console.log('userInfo', userInfo);
				totalMoney = parseFloat(userInfo.money) + parseFloat(userInfo.deposit_money) + parseFloat(userInfo.frozen_money);
				console.log('2totalMoney', totalMoney);
				totalMoney.toFixed(2);
				if (totalMoney == 0) {
					totalMoney = '0.00';
				}
				that.participationMoney = totalMoney;
			},
		},
		data() {
			return {
				login_type:2,
				status: '',
				group_money:'', //群money
				userInfo: '',
				defaultAvatar: '/static/images/user-center/timg.jpg',
				slider: [], // 广告轮播

				vipLevel: [], // vip等级
				starLevel: [], // 贡献等级
				expiryTime: '', // 服务过期时间
				isVipEnd: false, // 服务是否过期
				participationMoney: '', //红包金额

				isShowUserModal: false,

				usList: [{
						name: '我的店铺',
						url: '../merchant/no-merchant/no-merchant',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/shopIcon.png'
					},
					{
						name: '我的钱包',
						url: 'my-account/my-account',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/walletIcon.png'
					},
					{
						name: '我的团购',
						url: '/pages/merchant/my-merchant/my-group/my-group',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/groupIcon.png'
					},
					{
						name: '个人资料',
						url: 'my-info/my-info',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/businessIcon.png'
					},
					// { name: '我的队伍', url: 'my-team/my-team', src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/troopsIcon.png' },
					{
						name: '厂商加盟',
						url: 'news-detail/news-detail?id=17',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/troopsIcon.png'
					},
					{
						name: '我的收藏',
						url: 'my-collect/my-collect',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/collectIcon.png'
					},
					// { name: '会员权益', url: 'invite/invite', src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/inviteIcon.png' }, 
					{
						name: '会员权益',
						url: 'vip-card/vip-card?id=1',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/inviteIcon.png'
					},
					{
						name: '我的海报',
						url: 'my-info/poster/poster',
						src: 'http://aliyun.oss.zxgyzj.com/picture/tab_my/poster.jpg'
					},
				]
			}
		}
	}
</script>

<style>
	@import url("../../static/style/app.css");
	.user-avatar-container {
	  height: 20vh;
	  background-color: #333;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
	}
	
	.user-avatar-wrap {
	  display: flex;
	  align-items: center;
	  color: #fff;
	  padding: 0 30upx;
	}
	
	.user-avatar {
	  width: 120upx;
	  height: 120upx;
	  margin-left: 40upx;
	  border-radius: 50%;
	}
	
	.user-name-wrap {
	  padding: 10upx 0;
	}
	
	.user-type-wrap {
	  font-size: 12px;
	  padding-bottom: 10upx;
	}
	
	.user-type {
	  padding-right: 10upx;
	}
	
	.btn-ruzhu {
	  background-color: #f94c48;
	  padding:8upx 40upx;
	  border-radius: 8upx;
	}
	
	.user-level {
	  display: flex;
	  align-items: center;
	}
	
	.user-level-text,.user-level-text-mobile{
	  font-size: 12px;
	  padding-right: 10upx;
	  color:black;
	}
	.user-level-text{
	  color:white;
	}
	.user-level-text-mobile{
	  font-size:45upx;
	}
	.user-level-img {
	  display: flex;
	  align-items: center;
	font-size: 43upx;
	color: black;
	margin-top: -4upx;
	
	}
	
	.user-name {
	  padding-right: 10upx;
	}
	
	.icon-star {
	  width: 36upx;
	  height: 36upx;
	}
	
	.vip-star {
	  width: 30upx;
	  height: 30upx;
	  margin-right: 2px;
	}
	
	.avatar-wrap {
	  position: relative;
	}
	
	.updata-avatar {
	  position: absolute;
	  bottom: 0;
	  right: 0;
	  width: 40upx;
	  height: 40upx;
	  border-radius: 50%;
	}
	
	.ml-10 {
	  margin-left: 10upx;
	}
	
	.big-size {
	  font-size: 32upx;
	  margin-left: 0;
	}
	
	.renewal-fee {
	  font-weight: 700;
	  color: #f94c48;
	}
	
	/* 顶部样式修改 */
	.avatar-right-wrap {
	  padding-left: 84upx;
	  flex: 1;
	  font-size: 28upx;
	}
	
	.user-avatar-btn {
	  background-color: #f94c48;
	  color: #fff;
	  border-radius: 5px;
	  padding: 8upx 40upx;
	  width: 120upx;
	  text-align: center;
	  font-size: 28upx;
	}
	
	/* 广告轮播 */
	swiper {
	  height: 250upx;
	}
	
	.ad-slider-img {
	  width: 750upx;
	  height: 250upx;
	}
	.banner-img {
	  width: 100%;
	  height: 265upx;
	}
	.banner-img > image {
	  width: 100%;
	  height: 100%;
	}
	
	.exhibition {
	  display: flex;
	  padding: 20upx 20upx 20upx 20upx;
	  background-color: #fff;
	}
	/*排列3个的开始*/
	/* .exhibition-list {
	  width: 19%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-direction: column;
	  border-right: 1px solid #c5c5c5;
	  padding-right: 20upx;
	  font-size: 24upx;
	}
	.exhibition-list:nth-child(2){
	  width:12%;
	 padding-left: 12upx;
	padding-right: 10upx;
	}
	.exhibition-list:nth-child(4) {
	  border-right: 0;
	} */
	/*排列3个的开始*/
	/*排列4个的开始*/
	.exhibition-list {
	  width: 25%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-direction: column;
	  border-right: 1px solid #c5c5c5;
	  font-size: 24upx;
	}
	.exhibition-list:nth-child(4) {
	  border-right: 0;
	}
	/*排列4个的结束*/
	.color_red {
	  color: red;
	}
	.font32 {
	  font-size: 32upx;
	  font-weight: 600;
	}
	.font16 {
	  font-size: 24upx;
	  font-weight: 600;
	}
	
	.us {
	  display: flex;
	  flex-wrap: wrap;
	  padding-top:20upx;
	  /* padding: 20upx; */
	  /* margin: 20upx 0; */
	  background-color: #fff;
	}
	.us-list {
	  width: 25%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  flex-direction: column;
	  margin-bottom: 10upx;
	}
	.us-list:nth-child(4n) {
	  border-right: none;
	}
	.us-list-img {
	  width: 120upx;
	  height: 120upx;
	  border-radius: 5px;
	}
	.us-list-text {
	  margin-top: 10upx;
	  font-size: 28upx;
	}
	
	.industry {
	  padding: 20upx;
	  display: flex;
	}
	.industry-list {
	  width: 49.5%;
	  height: 160upx;
	  background-color: #fff;
	  margin-right: 1%;
	  display: flex;
	  justify-content: center;
	  align-items: center;
	  border-radius: 15upx;
	  padding: 0upx 20upx;
	  overflow: hidden;
	}
	.industry-list:nth-child(2){
	  margin-right: 0;
	}
	.industry-list-img {
	  width: 80upx;
	  height: 80upx;
	  margin-right: 20upx;
	}
	.industry-list-title {
	  font-size: 18upx;
	  color: #666;
	  text-align: center;
	}
	.industry-list-head {
	  color: #000;
	  font-size: 30upx;
	  font-weight: 600;
	}
	
	.user-header-btn {
	  display: inline-block;
	  padding: 2upx 20upx;
	  border-radius: 90upx;
	  background-color: #f94c48;
	  color: #fff;
	  margin-left: 10upx;
	  font-size: 24upx;
	}
	/*新增的名片样式*/
	.card {
	  width: 100%;
	  height: 520upx;
	  position: relative;
	}
	.card-img {
	  width: 100%;
	  height: 100%;
	  z-index: -1;
	}
	.card-block {
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 80%;
	}
	.block-head-img {
	  width: 180upx;
	  height: 180upx;
	  border-radius: 50%;
	  margin-right: 20upx;
	}
	.card-block-head {
	  border-radius: 15upx;
	  margin: 20upx 20upx 10upx 20upx;
	  background-color: white;
	  display: flex;
	  padding: 10upx 20upx 20upx 25upx;
	  flex-direction: column;
	
	}
	.card-block-head-top {
	  display: flex;
	  align-items: center;
	  height: 230upx;
	  width: 100%;
	}
	.block-head-user {
	  width: 70%;
	  color: #fff;
	  margin-top: 30upx;
	
	}
	.block-head-user-name {
	  width: 100%;
	  display: flex;
	  flex-direction: column;
	  height: 110upx;
	  font-size: 36upx;
	  font-weight: 600;
	}
	.block-head-user-name-title {
	  max-width: 100%;
	  white-space: nowrap;
	  font-size: 36upx;
	  color:black;
	  /* text-overflow: ellipsis; */
	}
	.user-level-img {
	  display: inline-block;
	}
	.icon-star {
	  width: 36upx;
	  height: 36upx;
	}
	
	.card-block-head-address {
	  height: 100upx;
	  display: flex;
	  align-items: flex-end;
	  color: #fff;
	  font-size: 32upx;
	}
	.address-card-name {
	  width: 90%;
	  margin-right:auto;
	  overflow:hidden;
	  text-overflow:ellipsis;
	  white-space:nowrap;
	  line-height: 1;
	  color:black;
	}
	  
	.address-card-host{
	  width: 36upx;
	  height: 48upx;
	  margin-right: 20upx;
	}
	.address-card-wx {
	  position: absolute;
	  top: 40upx;
	  right: 50upx;
	  width: 80upx;
	  height: 80upx;
	  z-index: 9;
	}
	
	.block-head-user-workCategory text {
	  border: 1px solid #FFB02D;
	  display: inline-block;
	  padding:  2upx 20upx;
	  margin: 18upx 20upx 10upx 0;
	  border-radius: 15upx;
	  color:black;
	}
	
	/* 个人简介 */
	.card-block-brief {
	  margin: 0 20upx;
	  padding-bottom: 20upx;
	}
	.card-block-brief-head {
	  height: 60upx;
	  margin: 10upx 0;
	  display: flex;
	  align-items: center;
	  color: #FFB02D;
	}
	.card-block-brief-img {
	  width: 30upx;
	  height: 40upx;
	  margin-right: 20upx;
	}
	.card-block-brief-intr {
	  /* width: 100%; */
	  margin: 20upx 20upx 0;
	  /* padding-bottom: 20upx; */
	  color: #FFB02D;
	  text-overflow: -o-ellipsis-lastline;
	  overflow: hidden;
	  text-overflow: ellipsis;
	  display: -webkit-box;
	  -webkit-line-clamp: 2;
	  line-clamp: 2;
	  -webkit-box-orient: vertical;
	}
	/*名片下的分享和拨打电话*/
	.card-line-btn {
	  padding: 20upx;
	  padding-bottom:0upx;
	  display: flex;
	}
	.line-btn-editinfo {
	width: 35%;
	height: 80upx;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 15upx;
	color: #fff;
	background-color: #666666;
	margin-right: 2%;
	
	}
	.line-btn-editinfo image {
	  width: 40upx;
	  height: 40upx;
	  margin-right: 20upx;
	}
	.line-btn-card {
	  width: 35%;
	  height: 80upx;
	  line-height: 80upx;
	  padding: 0;
	  border-radius: 15upx;
	  background-color:#656565;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  color:white;
	}
	.line-btn-card image {
	  width: 40upx;
	  height: 40upx;
	  margin-right: 20upx;
	}
	.line-btn-collect {
	  width: 26%;
	  height: 80upx;
	  margin-right: 2%;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  border-radius: 15upx;
	  background-color:#666666;
	  color:white;
	}
	.line-btn-collect image {
	  width: 32upx;
	  height: 32upx;
	  margin-right: 20upx;
	}
	/*名片结束页*/
	.btn-pay-service-yq{
	  background-color:#F8EAD0;
	 width: 60%;
	height: 91upx;
	line-height: 86upx;
	position: relative;
	font-size: 31upx;
	text-align: right;
	padding-right: 13upx;
	margin-left: 50upx;
	font-weight: 400;
	
	}
	.btn-pay-service-yq image{
	height: 50upx;
	width: 50upx;
	margin-top: 4upx;
	position: absolute;
	top: 14upx;
	left: 10upx;
	
	}
	/*免费开通会员*/
	.extension{
	  background-color: #efeff4;
	  height:50upx;
	  line-height:50upx;
	}
	.listActive {
	color: #f94c48;
	font-size:24upx;
	padding-left: 2upx;
	}

</style>
